<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>基础提示框</title>
</head>
<style>

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}
</style>
<body style="text-align: center;">
<div class="tooltip">鼠标移动到这里
    <span class="tooptiptext">提示文本</span>
</div>
</body>
</html>
